<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
	<title>首页</title>
</head>

<body>

	<main class="index_main">
		<!-- 轮播图 -->
		<div class="swiper">
			<div class="swiper-wrapper">
				<div class="swiper-slide" id="slide1"></div>
				<div class="swiper-slide" id="slide2"></div>
				<div class="swiper-slide" id="slide3"></div>
			</div>
			<!-- 如果需要分页器 -->
			<div class="swiper-pagination"></div>
		</div>
		<!-- 主体部分 -->
		<section class="main">
			<!-- 排名打卡 -->
			<div class="rank_clock">
				<!-- 排名 -->
				<div class="rank">
					<p class="rank_tady">今日排名</p>
					<p class="rank_num"></p>
				</div>
				<!-- 打卡 -->
				<div class="clock">
					<p class="addclock">累计打卡<span class="clock_num"></span>天</p>
					<p class="clockBtn_p"><button class="clockBtn">今日打卡</button></p>
				</div>

			</div>

			<!-- 运动数据+累计徽章 -->
			<div class="sports">
				<!-- 运动数据 -->
				<div class="sports_num">
					<a href="#">运动数据</a>
				</div>
				<!-- 累计徽章 -->
				<div class="badge">
					<p class="addbadge">累计运动徽章</p>
					<p class="badge_p">
						<span class="badge_num"></span>枚
					</p>
				</div>

			</div>
			<!-- 课程训练 -->
			<div class="train">
				<p><a href="./sports_course.html">课程训练</a></p>
			</div>
			<!-- 户外跑步 -->
			<div class="run">
				<p><a href="./sports_run.html">户外跑步</a></p>
			</div>
		</section>

	</main>
	<!-- 底部导航 -->
	<nav class="tabbar">
		
	</nav>
</body>

</html>